var { fs, fse, iconvLite, qr, dot, generateExcel, getLen, Uint8ToBase64 } = require("./require-public").default;

class TemplateRun {
    // ======================
    // 计数相关
    drawIndex = 0;
    exportObjArr = [];
    groupIndex = 0;

    indexTemp = 0;
    indexAll = 0;
    indexArr = [];
    // ======================

    canvas = null; // canvas对象
    ctx = null; // 画布对象

    allCtxWidth = 0; // 合版svg总宽度
    allCtxHeight = 0; // 合版svg总高度

    qrcodeWidth = 0; // 标签二维码尺寸

    pageAllCount = 0; // 纵向标签总数

    excelData = []; // excel生成数据

    doExportFinish = false; // 获取svg元素坐标信息完成

    imgData = ""; // 绘制svg图片
    rootPath = ""; // 根目录imgs下的子文件夹
    imgsPath = ""; // 全路径大种类下子文件夹
    imgsTempPath = ""; // 全路径大种类下子文件中的imgs-temp文件夹
    imgsExportPath = ""; // 全路径大种类下子文件中的imgs-export文件夹

    width = 0; // 版式单个标签宽度
    height = 0; // 版式单个标签高度

    selfRowNum = 0; // 版式默认行数
    selfColNum = 0; // 版式默认列数

    selfOffsetX = 0; // 版式默认x间隔
    selfOffsetY = 0; // 版式默认y间隔

    selfTempX = 0; // 版式默认起始标签x坐标
    selfTempY = 0; // 版式默认起始标签y坐标

    x = 0; // 实时标签x坐标
    y = 0; // 实时标签y坐标

    ctxWidth = 0; // 一组总宽度
    ctxHeight = 0; // 一组总高度

    selfGroupOffset = 0; // 版式一组间隔

    selfPageSingleCount = 0; // 一组标签个数

    starScale = 0; // 五角星缩放
    starOffsetX = 0; // 五角星x偏移
    starOffsetY = 0; // 五角星y偏移

    codeFontSize = 0; // 编码字体大小
    desFontSize = 0; // 描述字体大小

    dataForm = {}; // 配置参数

    tagType = ""; // 版式尺寸类型

    fontFamily = "SimHei";

    constructor(options) {
        if (options) {
            this.tagType = options.tagType;
            this.width = options.width;
            this.height = options.height;
            this.selfRowNum = options.selfRowNum;
            this.selfColNum = options.selfColNum;
            this.selfOffsetX = options.selfOffsetX;
            this.selfOffsetY = options.selfOffsetY;
            this.selfTempX = options.selfTempX;
            this.selfTempY = options.selfTempY;
            this.qrcodeWidth = options.qrcodeWidth;
            this.selfGroupOffset = options.selfGroupOffset;
            this.starScale = options.starScale;
            this.starOffsetX = options.starOffsetX;
            this.starOffsetY = options.starOffsetY;
            this.codeFontSize = options.codeFontSize;
            this.desFontSize = options.desFontSize;

            this.ctxWidth = (this.width / dot) * this.selfColNum + (this.selfOffsetX / dot) * (this.selfColNum + 1);
            this.ctxHeight = (this.height / dot + this.selfOffsetY / dot) * this.selfRowNum + this.selfTempY / dot;
            this.selfPageSingleCount = this.selfRowNum * this.selfColNum;
            console.log(this.tagType);
        }

        this.canvas = document.getElementById("mycanvas");
        this.ctx = this.canvas.getContext("2d");
    }

    // 合版备注
    getDesImg() {
        var desImgBuffer = fs.readFileSync(process.cwd() + "/resources/asar/des.svg", "utf-8");
        var desImg = `
        <g class="des-img-group" transform="translate(0,${Math.floor(this.allCtxHeight * this.dataForm.rowNum * dot)})">
        ${desImgBuffer}
        <text x="${106 * dot}" y="${31.5 * dot}" font-size="${6 * dot}" font-family="${this.fontFamily}" style="fill:black;">${this.dataForm.svgStyle.replace("-", "mm * ") + "mm"}</text>
        <text x="${80 * dot}" y="${21 * dot}" font-size="${6 * dot}" font-family="${this.fontFamily}" style="fill:black;">${"BD" + this.dataForm.imgNumBegin}</text>
        </g>`;
        this.dataForm.imgNumBegin = this.dataForm.imgNumBegin + 1;
        return desImg;
    }

    // 开始生成
    run(dataForm) {
        showLoading();
        setTimeout(() => {
            this.dataForm = dataForm;
            this.pageAllCount = this.selfPageSingleCount * this.dataForm.rowNum;
            this.allTypeDirs = fs.readdirSync(process.cwd() + "/jsons");
            console.log(this.allTypeDirs);
            console.time("耗时：");
            this.excelData = [];
            this.allExcelData = [];
            this.allDirsIndex = 0;
            this.imgsExportPath = process.cwd() + `/svgs`;

            this.allCtxHeight = this.ctxHeight + this.selfGroupOffset;
            this.allCtxWidth = this.ctxWidth + this.selfGroupOffset;

            this.canvas.width = this.allCtxWidth * this.dataForm.colNum * 2.835 * 3;
            this.canvas.height = (this.allCtxHeight * this.dataForm.rowNum + 200) * 2.835 * 3;

            this.defaultSvgStr = `<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="${Math.floor(this.allCtxWidth * 2.835)}" height="${Math.floor(
                this.allCtxHeight * this.dataForm.rowNum * 2.835
            )}" viewBox="0 0 ${Math.floor(this.allCtxWidth * dot)} ${Math.floor(this.allCtxHeight * this.dataForm.rowNum * dot)}" version="1.1">`;

            this.publucCombineSvg = `
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="${Math.floor(this.allCtxWidth * this.dataForm.colNum * 2.835)}" height="${Math.floor(
                (this.allCtxHeight * this.dataForm.rowNum + 200) * 2.835
            )}" viewBox="0 0 ${Math.floor(this.allCtxWidth * this.dataForm.colNum * dot)} ${Math.floor((this.allCtxHeight * this.dataForm.rowNum + 200) * dot)}" version="1.1">
`;

            fse.ensureDirSync(this.imgsExportPath);
            fse.emptyDirSync(this.imgsExportPath);

            // 大种类(营房，电梯，...)
            this.doAllTypeDirs(this.allTypeDirs, 0, () => {
                // 清除合版前的单个svg
                var imgsExportPathDirs = fs.readdirSync(this.imgsExportPath);
                for (let i = 0; i < imgsExportPathDirs.length; i++) {
                    const element = imgsExportPathDirs[i];
                    if (element.indexOf("xlsx") == -1 && element.indexOf("all") == -1) {
                        fs.unlinkSync(this.imgsExportPath + `/${element}`);
                    }
                }

                // svg转png
                if (this.dataForm.svgToPng) {
                    var imgsExportPathDirs = fs.readdirSync(this.imgsExportPath);
                    this.convertSvgToPng(imgsExportPathDirs, 0, () => {
                        clearLoading();
                        console.timeEnd("耗时：");
                    });
                } else {
                    clearLoading();
                    console.timeEnd("耗时：");
                }
            });
        }, 300);
    }

    // svg转png
    convertSvgToPng(imgsExportPathDirs, index, func) {
        if (index == imgsExportPathDirs.length) {
            func ? func() : "";
            return;
        }
        var element = imgsExportPathDirs[index];
        if (element.indexOf("svg") != -1) {
            this.ctx.fillStyle = "#fff";
            this.ctx.fillRect(0, 0, this.canvas.width, this.canvas.height);
            const path = this.imgsExportPath + `/${element.replace(".svg", ".png")}`;

            var img = new Image();
            img.src = this.imgsExportPath + `/${element}`;
            img.onload = () => {
                this.ctx.drawImage(img, 0, 0, this.canvas.width, this.canvas.height);
                var imgData = this.canvas.toDataURL("image/png");

                const base64 = imgData.replace(/^data:image\/\w+;base64,/, "");
                const dataBuffer = new Buffer(base64, "base64");
                fs.writeFileSync(path, dataBuffer);
                index++;
                this.convertSvgToPng(imgsExportPathDirs, index, func);
            };
        } else {
            index++;
            this.convertSvgToPng(imgsExportPathDirs, index, func);
        }
    }

    // 大种类(营房，电梯，...)
    doAllTypeDirs(allTypeDirs, index, func) {
        if (index == allTypeDirs.length) {
            func ? func() : "";
            return;
        }
        const bigType = this.allTypeDirs[index];

        // utf-8
        var fileData = fs.readFileSync(process.cwd() + `/jsons/${bigType}`, "utf-8");

        // gb2312
        // var fileData = fs.readFileSync(process.cwd() + `/jsons/${bigType}`);
        // fileData = iconvLite.decode(fileData, "gbk");

        fileData = JSON.parse(fileData);

        this.bigTypeName = fileData.title;

        this.allDirs = fileData.data;

        // 子种类(营房001，营房002，...)
        this.doInit(fileData.data, this.allDirsIndex, () => {
            // 多文件合版
            if (this.dataForm.svgWay == "multi") {
                if (this.dataForm.exportExcel) {
                    generateExcel(this.allExcelData, this.imgsExportPath + `/${this.bigTypeName}_export_all.xlsx`);
                }

                var imgsExportPathDirs = fs.readdirSync(this.imgsExportPath);
                for (let i = imgsExportPathDirs.length - 1; i >= 0; i--) {
                    const element = imgsExportPathDirs[i];
                    if (element.indexOf(this.bigTypeName) == -1 || element.indexOf("xlsx") != -1) {
                        imgsExportPathDirs.splice(i, 1);
                    }
                }

                var combineStr = "";
                var exportNumIndex = 0;
                var exportNumAll = 0;

                for (let i = 0; i < imgsExportPathDirs.length; i++) {
                    // if (imgsExportPathDirs.indexOf(this.allDirs[i]) != -1) {
                    // }
                    var svgData = fs.readFileSync(this.imgsExportPath + `/${imgsExportPathDirs[i]}`, "utf-8");
                    svgData = svgData
                        .replace(this.defaultSvgStr, "")
                        .replace("</svg>", "")
                        .replace(/<g class="one-group">/g, `<g class="one-group" transform="translate(${Math.floor(this.allCtxWidth * exportNumIndex * dot)}, 0)">`);
                    combineStr += svgData;

                    exportNumIndex++;

                    if ((i + 1) % this.dataForm.colNum == 0 || i == imgsExportPathDirs.length - 1) {
                        var combineSvg =
                            this.publucCombineSvg +
                            `
                            ${combineStr}
                            ${this.getDesImg()}
                        </svg>
                        `;

                        fs.writeFileSync(this.imgsExportPath + `/${this.bigTypeName}_export_all_${exportNumAll}.svg`, combineSvg, "utf-8");

                        combineStr = "";
                        exportNumIndex = 0;
                        exportNumAll++;
                    }
                }

                if (this.dataForm.exportExcel) {
                    // 清除合版前的单个excel
                    var imgsExportPathDirs = fs.readdirSync(this.imgsExportPath);
                    for (let i = imgsExportPathDirs.length - 1; i >= 0; i--) {
                        const element = imgsExportPathDirs[i];
                        if (element.indexOf("xlsx") == -1) {
                            imgsExportPathDirs.splice(i, 1);
                        }
                    }
                    for (let i = 0; i < imgsExportPathDirs.length; i++) {
                        const element = imgsExportPathDirs[i];
                        if (element.indexOf("export_all.xlsx") == -1) {
                            fs.unlinkSync(this.imgsExportPath + `/${element}`);
                        }
                    }
                }
            }

            index++;
            this.allExcelData = [];
            this.excelData = [];
            this.allDirsIndex = 0;
            this.doAllTypeDirs(allTypeDirs, index, func);
        });
    }

    // 子种类(营房001，营房002，...)
    doInit(allDirs, index, func) {
        if (index == allDirs.length) {
            func ? func() : "";
            return;
        }
        var element = allDirs[index];

        this.exportName = element.title;

        console.log(this.bigTypeName, this.exportName, `总数：${element.data.length}`);

        this.init(element.data, () => {
            index++;
            this.allDirsIndex = index;
            this.excelData = [];
            this.doInit(allDirs, index, func);
        });
    }

    init(fileData, func) {
        this.drawIndex = 0;
        this.groupIndex = 0;
        this.x = this.selfTempX;
        this.y = this.selfTempY;
        this.exportObjArr = [];
        this.doExportFinish = false;

        var result = [];
        for (var i = 0; i < fileData.length; i += this.pageAllCount) {
            result.push(fileData.slice(i, i + this.pageAllCount));
        }

        this.indexTemp = 0;
        this.indexAll = 0;
        this.indexArr = [];

        this.doExportMul(result, 0, (exportNum) => {
            this.allExcelData.push(...this.excelData);

            if (this.dataForm.exportExcel) {
                generateExcel(this.excelData, this.imgsExportPath + `/${this.exportName}_export.xlsx`);
            }

            // 单文件合版
            if (this.dataForm.svgWay == "single") {
                var imgsExportPathDirs = fs.readdirSync(this.imgsExportPath);
                for (let i = imgsExportPathDirs.length - 1; i >= 0; i--) {
                    const element = imgsExportPathDirs[i];
                    if (element.indexOf(this.exportName) == -1) {
                        imgsExportPathDirs.splice(i, 1);
                    }
                }

                if (this.dataForm.exportExcel) {
                    var len = imgsExportPathDirs.length - 1;
                } else {
                    var len = imgsExportPathDirs.length;
                }

                if (len != 1) {
                    var combineStr = "";

                    var exportNumIndex = 0;
                    var exportNumAll = 0;

                    for (let i = 0; i < len; i++) {
                        var svgData = fs.readFileSync(this.imgsExportPath + `/${this.exportName}_export_${i}.svg`, "utf-8");
                        svgData = svgData
                            .replace(this.defaultSvgStr, "")
                            .replace("</svg>", "")
                            .replace(/<g class="one-group">/g, `<g class="one-group" transform="translate(${Math.floor(this.allCtxWidth * exportNumIndex * dot)}, 0)">`);
                        combineStr += svgData;

                        exportNumIndex++;

                        if ((i + 1) % this.dataForm.colNum == 0 || i == exportNum - 1) {
                            var combineSvg =
                                this.publucCombineSvg +
                                `
                            ${combineStr}
                            ${this.getDesImg()}
                        </svg>
                        `;

                            fs.writeFileSync(this.imgsExportPath + `/${this.exportName}_export_all_${exportNumAll}.svg`, combineSvg, "utf-8");

                            combineStr = "";
                            exportNumIndex = 0;
                            exportNumAll++;
                        }
                    }
                } else {
                    var svgData = fs.readFileSync(this.imgsExportPath + `/${this.exportName}_export_0.svg`, "utf-8");
                    svgData = svgData.replace(this.defaultSvgStr, "").replace("</svg>", "");
                    var combineSvg =
                        this.publucCombineSvg +
                        `
                    ${svgData}
                    ${this.getDesImg()}
                </svg>
                `;
                    fs.writeFileSync(this.imgsExportPath + `/${this.exportName}_export_all_0.svg`, combineSvg, "utf-8");
                }
            }

            console.log("all finish");
            func ? func() : "";
        });
    }

    doExportMul(imgsTempPathDirsSplit, index, func) {
        if (index == imgsTempPathDirsSplit.length) {
            func ? func(index) : "";
            return;
        }
        var elementSplit = imgsTempPathDirsSplit[index];
        this.doExport(elementSplit, 0);
        var exportInterval = setInterval(() => {
            if (this.doExportFinish) {
                clearInterval(exportInterval);
                var dirName = this.allDirs[this.allDirsIndex];

                var addStr = `<g class="one-group">`;

                for (let i = 0; i < this.exportObjArr.length; i++) {
                    const element = this.exportObjArr[i];
                    var code = element.tagInfo.zcbm;
                    var info = element.tagInfo.des;
                    var qrData = element.tagInfo.qrData;

                    if (this.indexArr.indexOf(code) == -1) {
                        this.indexArr.push(code);
                        this.indexTemp++;
                    }

                    addStr += `<text x="${element.codeDetail.x + (this.width - getLen(code, this.codeFontSize)) / 2}" y="${element.codeDetail.y}" font-size="${this.codeFontSize}" font-family="${
                        this.fontFamily
                    }" style="fill:black;">${code}</text>\n`;

                    addStr += `<text x="${element.desDetail2.x + (this.width - getLen(info, this.desFontSize)) / 2}" y="${element.desDetail2.y}" font-size="${this.desFontSize}" font-family="${
                        this.fontFamily
                    }" style="fill:black;">${info}</text>\n`;

                    addStr += `<rect x="${element.borderDetail.x}" y="${element.borderDetail.y}" rx="${2 * dot}" ry="${2 * dot}" width="${element.borderDetail.width}" height="${
                        element.borderDetail.height
                    }" style="stroke:blue;stroke-width:2;fill:transparent;fill-opacity:0;stroke-opacity:1"/>\n`;

                    if (this.tagType == "40-40") {
                        addStr += `
                        <g transform="translate(${element.starDetail.x} ${element.starDetail.y}) scale(${this.starScale})" width="${element.starDetail.width}" height="${element.starDetail.height}" viewBox="0 0 ${element.starDetail.width} ${element.starDetail.height}">
                            <polygon points="42.73 0 44.74 6.18 51.23 6.18 45.98 10 47.98 16.18 42.73 12.36 37.47 16.18 39.48 10 34.23 6.18 40.72 6.18 42.73 0" fill="#f5333f"/>
                            <polygon points="78.37 1.35 80.05 6.5 85.46 6.5 81.08 9.68 82.75 14.83 78.37 11.64 73.99 14.83 75.67 9.68 71.28 6.5 76.7 6.5 78.37 1.35" fill="#f5333f"/>
                            <polygon points="60.55 1.35 62.22 6.5 67.64 6.5 63.26 9.68 64.93 14.83 60.55 11.64 56.17 14.83 57.84 9.68 53.46 6.5 58.88 6.5 60.55 1.35" fill="#f5333f"/>
                            <polygon points="7.09 1.35 8.76 6.5 14.17 6.5 9.79 9.68 11.47 14.83 7.09 11.64 2.71 14.83 4.38 9.68 0 6.5 5.41 6.5 7.09 1.35" fill="#f5333f"/>
                            <polygon points="24.91 1.35 26.58 6.5 32 6.5 27.61 9.68 29.29 14.83 24.91 11.64 20.53 14.83 22.2 9.68 17.82 6.5 23.23 6.5 24.91 1.35" fill="#f5333f"/>
                        </g>
                        `;
                    }
                    if (this.tagType == "80-80" || this.tagType == "70-40" || this.tagType == "300-200") {
                        addStr += `
                        <g transform="translate(${element.starDetail.x} ${element.starDetail.y}) scale(${this.starScale})" width="${element.starDetail.width}" height="${element.starDetail.height}" viewBox="0 0 ${element.starDetail.width} ${element.starDetail.height}">
                        <polygon points="80.17 0 83.33 9.74 93.58 9.74 85.29 15.77 88.45 25.51 80.17 19.49 71.88 25.51 75.04 15.77 66.75 9.74 77 9.74 80.17 0" fill="#f5333f"/><polygon points="149.15 2.13 151.79 10.25 160.33 10.25 153.42 15.27 156.06 23.39 149.15 18.37 142.25 23.39 144.88 15.27 137.98 10.25 146.52 10.25 149.15 2.13" fill="#f5333f"/><polygon points="114.66 2.13 117.3 10.25 125.84 10.25 118.93 15.27 121.57 23.39 114.66 18.37 107.75 23.39 110.39 15.27 103.48 10.25 112.02 10.25 114.66 2.13" fill="#f5333f"/><polygon points="11.18 2.13 13.82 10.25 22.35 10.25 15.45 15.27 18.09 23.39 11.18 18.37 4.27 23.39 6.91 15.27 0 10.25 8.54 10.25 11.18 2.13" fill="#f5333f"/><polygon points="45.67 2.13 48.31 10.25 56.85 10.25 49.94 15.27 52.58 23.39 45.67 18.37 38.76 23.39 41.4 15.27 34.49 10.25 43.03 10.25 45.67 2.13" fill="#f5333f"/>
                        </g>
                        `;
                    }

                    var qrImg = qr.imageSync(qrData, { type: "png", size: 5, margin: 0 });
                    var imageBuf = Uint8ToBase64(qrImg);
                    addStr += `<image id="image0" width="${element.qrcodeDetail.width}" height="${element.qrcodeDetail.height}" x="${element.qrcodeDetail.x}" y="${element.qrcodeDetail.y}" xlink:href="data:image/png;base64,${imageBuf}" />\n`;

                    if (element.groupTag && element.groupTag.indexOf(`class="one-group"`) != -1) {
                        addStr += element.groupTag;
                    }

                    if (element.groupBorderDetail) {
                        addStr += `<rect x="${element.groupBorderDetail.x}" y="${element.groupBorderDetail.y}" width="${element.groupBorderDetail.width}" height="${element.groupBorderDetail.height}" style="stroke:red;stroke-width:2;fill:transparent;fill-opacity:0;stroke-opacity:1"/>\n`;
                    }
                    if (element.titleDetail) {
                        addStr += `<text x="${(this.ctxWidth * dot - getLen(dirName.title, 8.5 * dot)) / 2}" y="${element.titleDetail.y}" font-size="${8.5 * dot}" font-family="${
                            this.fontFamily
                        }" style="fill:black;">${dirName.title}</text>\n`;
                    }

                    if (element.groupTag && element.groupTag.indexOf(`class="one-group"`) == -1) {
                        addStr += element.groupTag;
                    }

                    this.indexAll++;
                }

                var svg = `
                <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="${Math.floor(this.allCtxWidth * 2.835)}" height="${Math.floor(
                    this.allCtxHeight * this.dataForm.rowNum * 2.835
                )}" viewBox="0 0 ${Math.floor(this.allCtxWidth * dot)} ${Math.floor(this.allCtxHeight * this.dataForm.rowNum * dot)}" version="1.1">
                    ${addStr}
                </svg>
                `;

                fs.writeFileSync(this.imgsExportPath + `/${this.exportName}_export_${index}.svg`, svg, "utf-8");

                index++;

                this.drawIndex = 0;
                this.groupIndex = 0;
                this.x = this.selfTempX;
                this.y = this.selfTempY;
                this.exportObjArr = [];
                this.doExportFinish = false;
                this.doExportMul(imgsTempPathDirsSplit, index, func);
            }
        }, 10);
    }

    doExport(imgsTempPathDirs, exportIndex) {
        if (exportIndex == imgsTempPathDirs.length) {
            this.doExportFinish = true;
            return;
        }
        var element = imgsTempPathDirs[exportIndex];
        var exportObj = {};

        exportObj.tagInfo = element;

        // 绘制二维码
        exportObj.qrcodeDetail = {
            x: this.x + (this.width - this.qrcodeWidth) / 2,
            y: this.y + (this.height - this.qrcodeWidth) / 2 + 15,
            width: this.qrcodeWidth,
            height: this.qrcodeWidth,
        };

        // 绘制星星
        exportObj.starDetail = {
            x: this.x + this.starOffsetX,
            y: this.y + this.starOffsetY,
            width: this.qrcodeWidth,
            height: this.qrcodeWidth,
        };

        // 圆角边框z
        exportObj.borderDetail = {
            x: this.x,
            y: this.y,
            width: this.width,
            height: this.height,
        };

        // 编码
        if (this.tagType == "40-40" || this.tagType == "70-40") {
            exportObj.codeDetail = {
                x: this.x,
                y: this.y + this.height - 3.5 * dot,
                width: 0,
                height: 0,
            };
        }
        if (this.tagType == "80-80") {
            exportObj.codeDetail = {
                x: this.x,
                y: this.y + this.height - 8 * dot,
                width: 0,
                height: 0,
            };
        }
        if (this.tagType == "300-200") {
            exportObj.codeDetail = {
                x: this.x,
                y: this.y + this.height - 27 * dot,
                width: 0,
                height: 0,
            };
        }

        // 描述
        exportObj.desDetail2 = {
            x: this.x,
            y: this.y + this.height + 4 * dot,
            width: 0,
            height: 0,
        };

        if (exportIndex == 0) {
            exportObj.groupBorderDetail = {
                x: 0,
                y: this.y - this.selfTempY,
                width: this.ctxWidth * dot,
                height: this.ctxHeight * dot,
            };
            exportObj.titleDetail = {
                x: this.selfTempX,
                y: this.y - this.selfTempY + 10.5 * dot,
            };
        }

        this.x = this.x + this.width + this.selfOffsetX;
        exportIndex++;
        this.drawIndex++;
        if (this.drawIndex % this.selfPageSingleCount == 0) {
            this.groupIndex++;
            this.drawIndex = 0;
            this.x = this.selfTempX;
            this.y = this.selfTempY + (this.ctxHeight * dot + this.selfGroupOffset * dot) * this.groupIndex;
            if (!(exportIndex == imgsTempPathDirs.length)) {
                exportObj.groupBorderDetail = {
                    x: 0,
                    y: this.y - this.selfTempY,
                    width: this.ctxWidth * dot,
                    height: this.ctxHeight * dot,
                };
                exportObj.titleDetail = {
                    x: this.selfTempX,
                    y: this.y - this.selfTempY + 10.5 * dot,
                };
                exportObj.groupTag = `
                </g>
                <g class="one-group">
                `;
            }
        } else if (this.drawIndex % this.selfColNum == 0) {
            this.x = this.selfTempX;
            this.y = this.y + this.height + this.selfOffsetY;
        }

        if (exportIndex == imgsTempPathDirs.length) {
            exportObj.groupTag = `
            </g>
            `;
        }

        this.exportObjArr.push(exportObj);
        this.excelData.push({
            name: element.zcbm,
        });

        this.doExport(imgsTempPathDirs, exportIndex);
    }
}

export default TemplateRun;
